<!--
 * @Author: WangShuai 1830773767@qq.com
 * @Date: 2023-12-03 17:35:20
 * @LastEditors: WangShuai 1830773767@qq.com
 * @LastEditTime: 2025-06-04 19:19:43
 * @FilePath: \vue3_admin_template\project\src\components\PageNation\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <el-pagination
    @size-change="sizeChange"
    @current-change="currentChange"
    v-model:current-page="props.pageInfo.pageNo"
    v-model:page-size="props.pageInfo.limit"
    :page-sizes="[3, 5, 7, 9, 11]"
    :background="true"
    :pager-count="5"
    layout="  prev, pager, next, jumper,->,sizes,total,"
    :total="props.pageInfo.total"
  />
</template>

<script setup lang="ts">
const $emit = defineEmits(['currentChange', 'sizeChange'])
const props = defineProps({
  pageInfo: {
    type: Object,
    required: true,
  },
})
console.log('object', props.pageInfo)
const sizeChange = (val: number) => {
  $emit('sizeChange', val)
}
const currentChange = (val: number) => {
  $emit('currentChange', val)
}
</script>

<style lang="scss" scoped></style>
